// The Vue build version to load with the `import` command
// (runtime-only or standalone) has been set in webpack.base.conf with an alias.
import Vue from 'vue'
import App from './App'
import router from './router'
import axios from 'axios'

// 路由导航守卫
router.beforeEach((to, from, next) => {
  const token = localStorage.getItem('token')
  const pagesNeedAuth = [
    '/profile',
    '/editprofile'
  ]
  // 字符串在数组中不存在,返回-1  如果返回值大于等于0 证明存在于数组中,我们需要验证权限
  if (pagesNeedAuth.indexOf(to.path) >= 0) {
    if (token) {
      // 判断是否有token,如果有就给你跳转,没有就跳转到登陆页
      next()
    } else {
      next('/login')
    }
  } else {
    // 去其他页面的逻辑
    next();
  }

})

// 设置基准路径   相当于默认地址,这个地址是个人创建的,后台已经处理跨域问题
// axios.defaults.baseURL = "http://127.0.0.1:3000"   //本地服务器
axios.defaults.baseURL = "http://111.230.181.206:3000" //远程服务器
// 响应拦截器,在响应前拦截
axios.interceptors.response.use(res => {
  // console.log('数据被拦截')
  const {
    message,
    statusCode
  } = res.data;
  if (message && statusCode == 401) {
    Toast.fail(message)
  }
  if (message == "用户信息验证失败") {
    router.push('./login')
  }
  // 错误提示 直接在这里统一处理即可 必须要 return 才能返回数据
  return (res)
})

// 设置一个公共函数,在组件内可以直接使用 this.xxx是调用
// 可以使用vue.prototype 来进行定义
Vue.prototype.$fixImgUrl = function (url) {
  // 如果这个 url 没有http部分  就默认带上axios的基准路径
  var res = '';
  if (url.indexOf('http') < 0) {
    res = axios.defaults.baseURL + url
  } else {
    res = url
  }
  return res;
}
// 绑定到原型
Vue.prototype.$axios = axios;

//引入组件库
import Vant from 'vant';
//注册组件库
Vue.use(Vant);
//引入组件样式文件
import 'vant/lib/index.css';

// 引入 vant-ui 弹窗库 
import {
  Toast
} from 'vant';

// axios 拦截器,请求拦截器  在响应拦截器拦截的是响应结果,res
// 在请求拦截器,拦截的是我们的请求属性配置   有没有带 headers
axios.interceptors.request.use((config) => {
  // 判断有没有带 token  如果没有 我就在localStorage 里面找
  if (!config.headers.Authorization && localStorage.getItem('token')) {
    config.headers.Authorization = localStorage.getItem('token')
  }
  //  有拦截就要有返回
  return config;
})
Vue.config.productionTip = false
/* eslint-disable no-new */
new Vue({
  el: '#app',
  router,
  components: {
    App
  },
  template: '<App/>'
})
